<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<style>
#yfzl_manage_div_1, #yfzl_manage_div_2, #yfzl_manage_div_div_3,
	#yfzl_manage_div_4, #yfzl_manage_div_5 {
	padding: 10px;
}

#msg2 {
	height: 20px;
	color: red;
}

.modal-content {
	margin-top: 250px;
}

#change_title {
	color: red;
}

#yfzl_manage_div_detail {

}

#yfzl_manage_div_table {
	margin-top: 15px;
}

#yfzl_manage_div_table {
	text-align: center;
}
#wyxd_form_div{
	margin: 0 auto;
}
#wyxd_manage_div_1,#wyxd_manage_div_2,#wyxd_manage_div_3,#wyxd_manage_div_4,#wyxd_manage_div_5{
	margin-top: 30px;
}
#wyxd_div{
	padding-top: 10px;
	background: #C8E5BC;
}
</style>
<body>
	<div id="wyxd_div" style="display: none;margin: 0 auto;" class="row">
		<div id="">
			<div id="wyxd_form_div">
				<div style="background: #5bc0de;margin: 0 auto;text-align: center;">
					<p style="line-height: 50px;letter-spacing: 15px;font-size: 28px;color: white;">我要下单</p>
				</div>
				<form id="wyxd_form" class="modal-body">
					<div class="modal-body input-group-lg" id="change_div">
						<div id="wyxd_manage_div_1" class="input-group input-group-lg">
							<span class="input-group-addon">存放地点</span>
							<select class="form-control" id="wyxd_cfdd"></select>
						</div>
						<div id="xyxx">
							<div id="wyxd_manage_div_2" class="input-group input-group-lg">
							<span class="input-group-addon">衣服种类</span>
							<select class="form-control" id="wyxd_yfzl" "></select>
							<span class="input-group-addon">洗衣方法</span>
							<select class="form-control" id="wyxd_xyff" "></select>
							<span class="input-group-addon">衣服数量</span>
							 <input type="text" id="yfsl"
								class="form-control" placeholder="请输入衣服数量"
								aria-describedby="basic-addon1" required="required"
								name="yfzl_name" onchange="">
								<span class="input-group-addon btn btn-success" onclick="addhang(this)">添加</span>
								<span class="input-group-addon btn btn-danger" onclick="deletehang(this)">删除</span>
							</div>
						</div>
						<div id="wyxd_manage_div_1" class="input-group input-group-lg">
							<span class="input-group-addon">联系方式</span>
							<input type="text" id="lxfs"
								class="form-control" placeholder="请输入联系方式"
								aria-describedby="basic-addon1" required="required"
								name="lxfs">
						</div>
						<div id="wyxd_manage_div_2" style="text-align: center;height: 50px;">
							<p style="font-size: 24px;font-weight: bold;">合计</p>
							<div id="msg" style="font-size: 24px;color: red;text-align: center;letter-spacing: 10px;">
								
							</div>
							<div id="zj" style="font-size: 24px;color: red;text-align: center;letter-spacing: 10px;">
								
							</div>
						</div>
						<div id="msg2">
							<span class="msg2_span1"></span> <span class="msg2_span2"></span>
						</div>
					</div>
					<div class="modal-footer">
						<button id="tj" type="submit" class="btn btn-primary" onclick="tjwyxd()" disabled="disabled">提交</button>
						<button id="jsddjg" type="button" class="btn btn-primary" onclick="jsddzj()">计算价格</button>
					</div>
				</form>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
$("#wyxd_div").css("height",$(window).height() -230  + "px");
$("#wyxd_div").css("width",$(window).width() -10  + "px");
function jsddzj(){
	$("#tj").attr("disabled",true);
	$("#msg").html("");
	$("#zj").html("");
	var ddmx = '';
	var ddArr = new Array();
	var ok = true;
	$('#xyxx div').each(function(){
		ddmx += $(this).children("select:eq(0)").val()+";"+$(this).children("select:eq(1)").val()+";" + $(this).children("input").val()+","
		console.log($(this).children("input").val() == '');
		if($(this).children("input").val() == ''){
			ok = false;
		}
	})
	console.log(ok);
	if(!ok){
		$("#msg").html("请填写衣服数量...");
		return false;
	}
	console.log(ddmx);
	if($("#lxfs").val() == ''){
		$("#msg").html("请填写联系方式...");
		return false;
	}
	$.ajax({
		url : "jsddzj", //请求的url地址
		contentType : "application/json; charset=utf-8",
		dataType : "json", //返回格式为json
		type : "POST", //请求方式
		data : JSON.stringify({
			'ddmx':ddmx
		}),
		success : function(data) {
			$("#zj").html(data.zj);
			$("#tj").attr("disabled",false);
		},
		error : function(req) {
			alert("  error  请联系开发人员 ！");
		}
	});
}
var html = "";
function addhang(obj){
	if(html == ''){
		html = $(obj).parent().parent("div:eq(0)").html();
	}
	$("#xyxx").append(html);
}
function deletehang(obj){
	if($("#xyxx").children("div").length > 1){
		$(obj).parent().remove();
	}
}
$("#wyxd_form").submit(function() {
	$("#zj").html("");
	$("#msg").html("");
	var str = $("#yfsl").val().replace(/(^\s*)|(\s*$)/g, "");
	var ddmx = '';
	var ddArr = new Array();
	var ok = true;
	$('#xyxx div').each(function(){
		ddmx += $(this).children("select:eq(0)").val()+";"+$(this).children("select:eq(1)").val()+";" + $(this).children("input").val()+","
		console.log($(this).children("input").val() == '');
		if($(this).children("input").val() == ''){
			ok = false;
		}
	})
	console.log(ok);
	if(!ok){
		$("#msg").html("请填写衣服数量...");
		return false;
	}
	console.log(ddmx);
	if($("#lxfs").val() == ''){
		$("#msg").html("请填写联系方式...");
		return false;
	}
	if(!isNaN(str)){
		$("#tj").attr("disabled",false);
		$.ajax({
			url : "wyxd", //请求的url地址
			contentType : "application/json; charset=utf-8",
			dataType : "json", //返回格式为json
			type : "POST", //请求方式
			data : JSON.stringify({
				'cfdd':$("#wyxd_cfdd").val(),
				'ddmx':ddmx,
				'lxfs':$("#lxfs").val()
			}),
			success : function(data) {
				$("#msg").html(data.msg);
			},
			error : function(req) {
				alert("  error  请联系开发人员 ！");
			}
		});
	}else{
		$("#msg").html("衣服数量 不是有效的数字...");
		$("#tj").attr("disabled",true);
	}
	return false;
})
function tjwyxd(){
	
	
}
function yfslChange(){
	$("#msg").html("");
	$("#zj").html("");
	$("#tj").attr("disabled",true);
}
function wyxdQuery(){
	$.ajax({
		url : "wyxd_query", //请求的url地址
		contentType : "application/json; charset=utf-8",
		dataType : "json", //返回格式为json
		type : "POST", //请求方式
		beforeSend : function() {
		},
		success : function(data) {
			if(data.cfdd.length == 0 || data.yfzl.length == 0 || data.xyff.length == 0){
				$("#tj").attr("disabled",true);
			}else{
				var str ="";
				for(var i = 0; i < data.cfdd.length;i++){
					str += "<option>"+ data.cfdd[i].cfdd +"</option>"
				}
				$("#wyxd_cfdd").html(str);
				str ="";
				for(var i = 0; i < data.yfzl.length;i++){
					str += "<option>"+ data.yfzl[i].yfzl +"</option>"
				}
				$("#wyxd_yfzl").html(str);
				str ="";
				for(var i = 0; i < data.xyff.length;i++){
					str += "<option>"+ data.xyff[i].xyff +"</option>"
				}
				$("#wyxd_xyff").html(str);
			}
		},
		error : function(req) {
			alert("  error  请联系开发人员 ！");
		}
	});
}
</script>
</html>